<template>
  <div class="search">
    <f-drawer ref="orderDrawer" :title="drawerTitle" width="70%" @submit="handleSubmit" @visibleChange="visibleChange">
      <a-tabs @tabClick="tabClick" :defaultActiveKey="current" v-model="current">
        <a-tab-pane tab="订单信息" key="form1" v-if="drawerVisible">
          <order-form ref="form1" v-if="drawerVisible"></order-form>
        </a-tab-pane>
        <a-tab-pane tab="商品信息" key="form2" v-if="formData.orderId">
          <order-drugs ref="form2" v-if="drawerVisible"></order-drugs>
        </a-tab-pane>
<!--        <a-tab-pane tab="附件上传" key="form3" v-if="formData.orderId">-->
<!--          <order-attachment ref="form3" v-if="drawerVisible"></order-attachment>-->
<!--        </a-tab-pane>-->
      </a-tabs>
      <a-button type="default" slot="drawerFooter" v-if="stepIndex>0">上一步</a-button>
      <a-tooltip placement="topLeft" title="仅保存订单信息,暂不添加商品" slot="drawerFooter">
        <a-button type="default" v-if="current=='form1'" @click="handleSubmit(0)">保存订单</a-button>
      </a-tooltip>
      <a-button type="danger" slot="drawerFooter" v-if="current=='form1'&&!formData.orderId" style="margin-left: 3px;" @click="handleSubmit(1)">添加商品</a-button>
      <a-button type="default" slot="drawerFooter" v-if="current=='form4'" style="margin-left: 3px;" @click="handleSubmit(0)">保存</a-button>
      <!--a-button type="default" slot="drawerFooter" style="margin-left: 3px;" v-if="current=='form3'">打印发货单</a-button>-->
    </f-drawer>
  </div>
</template>
<script>
  import orderForm from './order_form.vue'
  import OrderDrugs from './order_drugs'
  import OrderSendInfo from './order_send_info'
  import OrderAttachment from './order_attachment'

  export default {
    name: 'orderDrawer',
    props: {},
    data() {
      return {
        refs: this.$refs,
        drawerVisible: false,
        isEdit: false,
        title: '',
        stepIndex: 0,
        current: 'form1',
        formData: {},
        forms: [
          'form1'
        ]
      }
    },
    methods: {
      showDrawer(data) {
        this.isEdit = false
        if (data && data.orderId) {
          this.isEdit = true
          this.formData = data
        } else {
          this.formData = {}
        }
        this.refs['orderDrawer'].show()
        this.tabClick('form1')
      },
      handleSubmit(opt) {
        this.refs[this.current].handleSubmit((data) => {
          if (opt == 0) {
            this.$refs.orderDrawer.close()
          } else {
            this.formData = data
            this.tabClick('form2')
          }
        })
      },
      visibleChange(drawerVisible) {
        this.drawerVisible = drawerVisible
        if (drawerVisible == false) {
          //刷新订单列表
          this.$emit('success')
        }
      },
      tabClick(name) {
        this.current = name
        if (this.current === 'form1') {
          this.title = this.isEdit ? '编辑订单(' + this.formData.orderNo + ')' : '添加订单'
        }
        this.$nextTick(() => {
          console.info("###################################################orderform",this.formData)
          this.refs[this.current].setData(this.formData)
        })
      }
    },
    computed: {
      drawerTitle: function() {
        return this.title
      }
    },
    created() {
    },
    components: { OrderSendInfo, OrderDrugs, orderForm,OrderAttachment }
  }
</script>

<style scoped lang="less" rel="stylesheet/less">

</style>
